<script>
import Content from "./content" 

export default {
    name:"Tabs",
    props:{
        currentIndex:{
            type:[String,Number],
            default:"0"
        }
    },
    components:{
        Content
    },
    methods:{
        onChangeIndex(index){
            this.$emit("changeKey",index)
        }
    },
    data(){
        return{
            panes:[]
        }
    },
    render(){
        return(
            <div>
                <ul class="tabs-header">
                    {this.$slots.default}
                </ul>
                <Content panes={this.panes}/>
            </div>
        )
    }
}
</script>
<style scoped>
.tabs-header {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  border-bottom: 2px solid #ededed;
}
</style>
